<extend name="Public/base"/>

<block name="body">
<link type="text/css" rel="stylesheet" href="{$admin_css}"/>
<div class="main-title">
    <h2>模板管理</h2>
</div>

<div class="with-padding">
    <div style="margin-bottom: 5px" class="tab-wrap">
        <ul class="nav nav-secondary group_nav">
            <volist name="types" id="types">
                <li <eq name="type" value="$key"> class="active"</eq>><a href="{:U('template', array('type'=>$key))}">{$types}</a></li>
            </volist>
        </ul>
    </div>
    <br>
    <form method="post" id="saveTemplate">
        <ul class="template_select" style="padding-left: 120px;">
            <volist name="tempList" id="vo">
                <li class="template_item {$vo.class}">
                    <if condition = "!empty($vo[desc])">
                        <div class="use_tips">{$vo.desc}</div>
                    </if>
                    <div class="phone">
                        <img src="{$vo.icon}" />
                    </div>
                    <p><input type="radio" {$vo.checked} name="template_{$type}" id="template_{$vo.dirName}" value="{$vo.dirName}"/>
                        <label for="template_{$vo.dirName}">{$vo.title}</label></p>
                </li>
            </volist>
        </ul>
    </form>
</div>

<script type="text/javascript">

$(function(){
    //选择模板并且ajax提交
    //选择Ajax提交        
    $('.template_item').click(function(){
        if(!$(this).hasClass('selected')){
            $(this).addClass('selected');
            $(this).siblings().removeClass("selected");
            $(this).find('input').click();

            //如果不是ajax提交 不要以下代码"{:$_GET['_action']}"
            var value = $(this).find('input').val();
          
            $.ajax({
                url:"{:U('template')}",
                data:{ "template_{$type}" : value },
                type:"post",
                dataType:"json",
                success:function(data){
                    if(data.status){
                        //提交成功
                        updateAlert(data.info, 'success');
                    } else {
                        updateAlert(data.info, 'danger');
                    }
                }
            })
        }
    });
})

$('.template_item').hover(function(){
    $(this).find('.use_tips').stop().fadeIn();
    $(this).addClass('hover');
    },function(){
        $(this).find('.use_tips').stop().fadeOut();
        $(this).removeClass('hover');
})
</script>
</block>